﻿<html>
<head>
<script src="lib/jquery.min.js"></script>
<script src="lib/jquery-ui.min.js"></script>
<link href="fullcalendar.min.css" rel="stylesheet" />
<script src="lib/moment.min.js"></script>
<script src="fullcalendar.min.js"></script>
<script src="locale-all.js"></script>

<script>
	$(document).ready(function() {
		$('#calendar').fullCalendar({
			header: {
				left: 'prev,next,today',
				center: 'title',
				right: 'month,basicWeek,agendaDay,listMonth'
			},
			editable: true,
			eventLimit: true,
			navLinks: true,
			locale: 'zh-cn',
			businessHours: false,
			events: function(start, end, timezone, callback){
				alert("aaa")
			},
			dayClick: function(date, allDay, jsEvent, view) {
	        	alert($.fullCalendar.formatDate(date, "YYYY-MM-DD"));
			},
			eventClick: function(event) {
				alert(event.title);
			}
			
		});
		
	});
 
</script>
<style>
	body {
		margin: 40px 10px;
		padding: 0;
		ont-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
		ont-size: 14px;
	}
	#calendar {
		max-width: 900px;
		margin: 0 auto;
	}

</style>
</head>

<body>
<div id='calendar'></div>
</body>

</html>